<template>
  <nav class="navbar fixed-top bg-primary">
    <router-link
      to="/articles"
      v-bind:class="['nav-link', item == 1 ? 'text-white' : 'text-light']"
      >文章列表</router-link
    >
    <div id="" :class="['nav-link', item == 2 ? 'text-white' : 'text-light']">
      <select
        v-model="selected"
        @change="changeHref(parseInt(selected))"
        class="form-control"
        id="sel1"
      >
        <option value="1" >文章发布</option>
        <option value="2">医药时政</option>
        <option value="3">药品文章</option>
      </select>
    </div>
    <router-link
      to="/commentEdit"
      :class="['nav-link', item == 3 ? 'text-white' : 'text-light']"
      >评论管理</router-link
    >
    <router-link
      to="/user"
      :class="['nav-link', item == 4 ? 'text-white' : 'text-light']"
      >用户管理</router-link
    >
    <router-link
      to="/notices"
      :class="['nav-link', item == 4 ? 'text-white' : 'text-light']"
      >公告栏</router-link
    >
  </nav>
</template>

<script>
export default {
  name: "Head",
  props: {
    item: Number,
  },
  data() {
    return {
      selected: 1,
    };
  },
  methods: {
    changeHref: function (sortnum) {
      switch (sortnum) {
        case 1:
          this.$router.push({
            path: "/",
          });
          break;
        case 2:
          this.$router.push({
            path: "/articleAdd",
          });
          break;
        case 3:
          this.$router.push({
            path: "/goodsArticleAdd",
          });
          break;
      }
    },
  },
};
</script>

